{% extends 'usersinfo_base.html' %}

{% load staticfiles %}

{% block title %}  在线学习网——注册  {% endblock %}

{% block body %}
<section>
    <div class="c-box bg-box">
        <div class="login-box clearfix">
            <div class="hd-login clearfix">
                <a class="index-logo" href="{% url 'index' %}"></a>
                <h1>用户注册</h1>
                <a class="index-font" href="{% url 'index' %}">回到首页</a>
            </div>
            <div class="fl slide">
                <div class="imgslide">
                    <ul class="imgs">

                        <li><a href=""><img width="483" height="472" src="{% static 'images/57a801860001c34b12000460.jpg' %}" /></a></li>

                        <li><a href=""><img width="483" height="472" src="{% static 'images/57a801860001c34b12000460.jpg' %}" /></a></li>

                        <li><a href=""><img width="483" height="472" src="{% static 'images/57a801860001c34b12000460.jpg' %}" /></a></li>

                    </ul>
                </div>
                <div class="unslider-arrow prev"></div>
                <div class="unslider-arrow next"></div>
            </div>
            <div class="fl form-box">
                <div class="tab">
                    <h2>邮箱注册</h2>
                </div>
                <div class="tab-form">
                    <form id="email_register_form" method="post" action="{% url 'users:register' %}" autocomplete="off">
{#                        如果form验证存在邮箱错误，则邮箱输入框变红#}
                        <div class="form-group marb20 {% if register_form.errors.email %} errorput {% endif %}" >
                            <label>邮&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;箱</label>
{#                            将用户输入数据回填到输入框中，在value设置#}
                            <input  type="text" id="id_email" name="email" value="{% if register_form.email.value %}{{ register_form.email.value }}{% endif %}" placeholder="请输入您的邮箱地址" />
                        </div>
                        <div class="form-group marb8 {% if register_form.errors.password %} errorput {% endif %}">
                            <label>密&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;码</label>
                            <input type="password" id="id_password" name="password"  value="{% if register_form.password.value %}{{ register_form.password.value }}{% endif %}" placeholder="请输入6-20位非中文字符密码" />
                        </div>
                        <div class="form-group marb8 captcha1 {% if register_form.errors.captcha %} errorput {% endif %}">
                            <label>验&nbsp;证&nbsp;码</label>
                            {{ register_form.captcha }}
                        </div>
                        <div class="error btns" id="jsEmailTips">
                        {% if register_form.errors.items %}
                            {% for key,error in register_form.errors.items %}
                                {{ error }}
                            {% endfor %}
                        {% else %}
                            {{ msg }}
                        {% endif %}
                        </div>
                        <div class="auto-box marb8">
                        </div>
                        <input class="btn btn-green" id="jsEmailRegBtn" type="submit" value="注册并登录" />
                        {% csrf_token %}
                    </form>
                </div>
                <p class="form-p">已有账号？<a href="{% url 'users:login' %}">[立即登录]</a></p>
            </div>
        </div>
    </div>
</section>
{% endblock %}

